<!--tvm票款差异协查-->
<template>
  <div class="huLianWangShouPiaojiDataInput EditorOrAdd el-card is-always-shadow el-card__body">
    <el-dialog
      title="互联网售票机数据线网编辑操作"
      :visible.sync="dialogVisible"
      @close="closed"
      width="950px">
      <avue-form v-if="isReload" class="huLianWangShouPiaojiDataInputForm" :option="option" v-model="formData" @submit="handleSubmit">
        <template slot-scope="scope" slot="lineCode">
          <el-select v-model="formData.lineCode" placeholder="请选择" style="width: 150px" clearable :disabled="showType==3" filterable>
            <el-option
              v-for="(item,index) in lineCodes"
              :key="index"
              :label="item.name"
              :value="item.code">
            </el-option>
          </el-select>
        </template>
        <template slot-scope="scope" slot="stationCode">
          <el-select v-model="formData.stationCode" placeholder="请选择" style="width: 150px"  @change="changeStation" :disabled="showType==3" filterable>
            <el-option
              v-for="(item,index) in stationCodes"
              :key="index"
              :label="item.name"
              :value="item.code">
            </el-option>
          </el-select>
        </template>
        <!-- slot卡槽的名字为prop+Search，对应下面option的column里面的prop -->
        <template slot-scope="scope" slot="equipmentCode">
          <el-select v-model="formData.equipmentCode" placeholder="请选择" style="width: 150px" clearable @change="getSheBei" :disabled="showType==3" filterable>
            <el-option
              v-for="(item,index) in equipmentNumbers"
              :key="index"
              :label="item.equipmentCode"
              :value="item.equipmentCode">
            </el-option>
          </el-select>
        </template>
        <!-- <template  slot-scope="scope"  slot="equipmentCode">
          <el-select v-model="formData.equipmentCode" placeholder="请选择" style="width: 150px" :disabled="showType==3">
            <el-option
              v-for="(item,index) in equipmentCodes"
              :key="index"
              :label="item.equipmentCode"
              :value="item.equipmentCode">
            </el-option>
          </el-select>
        </template> -->
        <!-- <template slot-scope="scope"  slot="revenueDate">
          <el-select v-model="formData.revenueDate" placeholder="请选择" style="width: 150px" :disabled="showType==3">
            <el-option
              v-for="(item,index) in staticDates"
              :key="index"
              :label="item.revenueDate"
              :value="item.revenueDate">
            </el-option>
          </el-select>
        </template> -->
        <template slot-scope="{row}" slot="unitPrice">
          <el-input-number v-model="row.unitPrice" controls-position="right" precision="2" :min="0" :max="10000000" :disabled="showType==3"></el-input-number>
        </template>
        <template slot-scope="{row}" slot="saleNumber">
          <el-input-number v-model="row.saleNumber" controls-position="right" :min="0" :max="10000000" :disabled="showType==3"></el-input-number>
        </template>
        <template slot-scope="scope" slot="menuForm" >
          <el-button type="primary" @click="closed">返回</el-button>
        </template>
      </avue-form>
    </el-dialog>
  </div>
</template>


<script>
  import {getForm, postForm} from '@/api/gen/gen'
  import ExportJsonExcel from "js-export-excel";
  import {
    fenExYuangettoFixed,
    getgetStationCodes,
    getLineCodes,
    getSwPmDeviceOperationCodeList,getSwPmInternetTicketEquipmentCodeList,
    qianxiangType
  } from "../../../../../../api/subwayRat/commonCheck";
  import {mondifySwAuInputInternetTicketEquipmentDetail} from "../../../../../../api/subwayRat/TVMRevenueVarianceAudit.TvmChaYiDXC/huLianWangShoupiaoji/huLianWangShouPiaojiXianWang";


  export default {
    components:{
    },
    data() {
      return {
        isReload:true,
        //1编辑，2添加，3预览
        showType:1,
        dialogVisible:true,
        lineCodes:[],
        stationCodes:[],
        equipmentCodes:[],
        equipmentNumbers:[],
        staticDates:[],
        formData:{
          dynamic: []
        },
        option:{
        }
    }
    },
    created() {
    },
    methods: {
      handleSubmit(form,done){
        let param={};
        param.id=this.formData.id;
        param.lineCode=this.formData.lineCode;
        param.stationCode=this.formData.stationCode;
        param.revenueDate=this.formData.revenueDate;
        param.equipmentCode=this.formData.equipmentCode;
        param.compareTotalNumberSales=this.formData.compareTotalNumberSales;
        param.compareSubtotalTotal=Number(this.formData.compareSubtotalTotal)*100;
        mondifySwAuInputInternetTicketEquipmentDetail(param).then(res=>{
          if(res.data.code==0){
            this.$message.success("操作成功！");
          }else{
            this.$message.error("操作失败！");
          }
          this.closed();
          this.$parent.getList();
        }).catch((e)=>{
          this.$message.error("操作失败！");
        });
        done();
        console.log(this.formData)
      },
      recallShow(id,row,showType){
        this.showType=showType;
        this.getOption();
        this.formData={}
        Object.assign(this.formData,row);
        this.formatterAmount(this.formData,true);
        this.changeLine(row.lineCode);
        this.getSheBei({lineCode:row.lineCode,stationCode:row.stationCode});
      },
      formatterAmount(row,isYuan){ //格式化日期
        if(isYuan){
          row.unitPrice=fenExYuangettoFixed(row,'unitPrice');
          row.totalSaleAmount=fenExYuangettoFixed(row,'totalSaleAmount');
        }else if(!isYuan){
          row.unitPrice=Number(row.unitPrice)*100;
          row.totalSaleAmount=Number(row.totalSaleAmount)*100;
        }
      },
      closed(){
        this.dialogVisible=false;
        this.$parent.isShowDiaEditor=false;
      },
      getOption(){
        this.option={
          submitBtn:this.showType!=3,
          emptyBtn:false,
          group:[
            {
              icon:'',
              label: '',
              // collapse:false,
              prop: 'group1',
              column: [{
                label: '线路',
                prop: 'lineCode',
                type: 'select',
                labelWidth:130,
                formslot:true,
                disabled: this.showType==3
              },{
                label: '站点',
                prop: 'stationCode',
                type: 'select',
                // width:250,
                labelWidth:130,
                formslot:true,
                disabled: this.showType==3
              },{
                label: '日期',
                prop: 'revenueDate',
                // width:'250',
                labelWidth:130,
                type:'date',
                valueFormat: 'yyyy-MM-dd',
                disabled: this.showType==3
                //formslot:true,
              },{
                label: '设备编号',
                prop: 'equipmentCode',
                // width:'250',
                labelWidth:130,
                type:'select',
                disabled: this.showType==3,
                formslot:true,
              },{
                label: '发售数量',
                prop: 'compareTotalNumberSales',
                // width:'250',
                labelWidth:130,
                type:'number',
                disabled: this.showType==3
              },
              // {
              //   label: '票价',
              //   prop: 'totalSaleAmount',
              //   // width:'250',
              //   labelWidth:130,
              //   type:'number',
              //   precision:2,
              //   disabled: this.showType==3
              // },
              {
                label: '小计金额',
                prop: 'compareSubtotalTotal',
                // width:'250',
                labelWidth:130,
                type:'number',
                precision:2,
                disabled: this.showType==3,
                
              }]
            },
          ]
        } ;
        this.isReload=false;
        this.$nextTick(()=>{
          this.isReload=true;
        })
      },
      changeLine(v){ //改变线路时
        getgetStationCodes(v).then(res=>{
          this.stationCodes=res;
        })
      },
      changeStation(v){
        this.getSheBei();
      },
      getSheBei(){
          getSwPmInternetTicketEquipmentCodeList({lineCode:this.formData.lineCode,stationCode:this.formData.stationCode}).then(r=>{
            this.equipmentNumbers=r.data.data;
        });
      },
      // async getSheBei(p){
      //   let res=[];
      //   await getSwPmDeviceOperationCodeList(p).then(r=>{
      //     res=r.data.data;
      //   });
      //   this.equipmentCodes=res;
      //   return res;
      // }
    },
    watch: {
      formData: {
        handler() {
          this.formData.compareSubtotalTotal = this.formData.compareSubtotalTotal/100;
        }
      }
    },
    mounted() {
      getLineCodes().then(res=>{ //获取线路
        this.lineCodes=res;
      });
    },
  }
</script>
<style lang="scss">
  .huLianWangShouPiaojiDataInput.EditorOrAdd{
    .avue-group[index='2']{
      .avue-form__group{
        .avue-form__row{
          width: 100%;
        }
      }
    }
    @media only screen and (min-width: 992px){
      width: 100%;
    }
  }

</style>
